﻿@using ORM.Helpers
@model ORM.ViewModels.Guides.CommentListViewModel
<div id="commentList">
    @foreach (var item in Model.Comments)
    {
        if (item.Highlight)
        {
            <table id="commentFieldSet @item.Id" width="100%" style="vertical-align: top; background-color: lightcyan">
                <tr>
                    <td style="width: 8%; vertical-align: top; padding-top: 5px">
                        <a href="/Account/Details/@item.PostBy.Id">
                            <img src="@Url.UserAvatar(item.PostBy, ORM.Models.ImageType.Big)" alt="Ảnh đại diện" class="big-imgavatar" height="60px" width="60px" style="padding-top: 5px" /></a>
                    </td>
                    <td style="width: 90%; vertical-align: top">
                        <a class="titleLink" href="/Account/Details/@item.PostBy.Id" style="text-decoration:none; font-weight: bold">@item.PostBy.Username</a>
                        <span style="font-size: 13px; color: grey">- @item.PostBy.Ponit điểm</span> <span
                                                                                                        style="float: right; display: table-cell">+<span id="commentPoint @item.Id">@item.UpVotes
                                                                                                                                                   </span>
                                                                                                        <img src="/Content/Images/vote-yes.ico" width="18px" height="18px" /></span>
                        <div class="removeSpace">
                            @Html.Raw(item.ContentHtml)
                        </div>
                        <br />
                        <table width="100%">
                            <tr>
                                <td style="padding-left: 0px">
                                    <span style="font-size: 13px; color: grey">Đăng lúc @item.PostedDate.ToString("HH:mm")
                                        ngày @item.PostedDate.ToString("dd-MM-yyyy")
                                    </span>
                                </td>
                                <td style="text-align: right; padding: 0px">
                                    @if (Model.CurrentUserId != 0)
                                    {
                                        <table style="font-size: 12px; float: right; text-align: right; padding-right: 0px">
                                            <tr>
                                                @if (Model.CurrentUserId == item.PostBy.Id)
                                                {
                                                    <td style="text-align: right;">
                                                        <a href="/Guide/EditComment?Id=@item.Id" class="titleLink" style="cursor: pointer; color: #034af3">
                                                            Sửa bình luận</a>
                                                    </td>
                                                    <td style="text-align: right; padding-right: 0px">
                                                        <span class="titleLink" onclick="DeleteAnComment('@item.GuideId','@item.Id')" style="cursor: pointer; color: #034af3">
                                                            Xoá bình luận</span>
                                                    </td>
                                                }
                                                else
                                                {
                                                    if (item.IsVotedByCurrentUser)
                                                    {
                                                        <td style="text-align: right;">
                                                            <span class="titleLink" onclick="PlusPointForAnComment('@item.Id')" style="cursor: pointer; color: #034af3">
                                                                <span id="VoteCommentText @item.Id">Bỏ thích</span></span>
                                                        </td>
                                                                      
                                                    }
                                                    else
                                                    {
                                                        <td style="text-align: right;">
                                                            <span class="titleLink" onclick="PlusPointForAnComment('@item.Id')" style="cursor: pointer; color: #034af3">
                                                                <span id="VoteCommentText @item.Id">Thích</span></span>
                                                        </td>
                                                    }

                                                    if (item.IsReportedByCurrentUser)
                                                    {
                                                        <td style="text-align: right;">
                                                            <span class="titleLink" onclick="ReportAnComment('@item.Id')" style="cursor: pointer; color: #034af3">
                                                                <span id="VoteCommentText @item.Id">Huỷ báo cáo sai phạm</span></span>
                                                        </td>
                                                                      
                                                    }
                                                    else
                                                    {
                                                        <td style="text-align: right;">
                                                            <span class="titleLink" onclick="ReportAnComment('@item.Id')" style="cursor: pointer; color: #034af3">
                                                                <span id="ReportCommentText @item.Id">Báo cáo sai phạm</span></span>
                                                        </td>
                                                    }
                                                    if (User.IsInRole("Admin"))
                                                    {
                                                        <td style="text-align: right; padding-right: 0px">
                                                            <span class="titleLink" onclick="DeleteAnComment('@item.GuideId','@item.Id')" style="cursor: pointer; color: #034af3">
                                                                Xoá bình luận</span>
                                                        </td>
                                                    }
                                                }
                                            </tr>
                                        </table>
                                    }
                                </td>
                            </tr>
                        </table>
                    </td>
                </tr>
            </table>
            <br />
        }
        else
        {
            <table id="commentFieldSet @item.Id" width="100%" style="vertical-align: top">
                <tr>
                    <td style="width: 8%; vertical-align: top; padding-top: 5px">
                        <a href="/Account/Details/@item.PostBy.Id">
                            <img src="@Url.UserAvatar(item.PostBy, ORM.Models.ImageType.Big)" alt="Ảnh đại diện" class="big-imgavatar" height="60px" width="60px" style="padding-top: 5px" /></a>
                    </td>
                    <td style="width: 90%; vertical-align: top">
                        <a class="titleLink" href="/Account/Details/@item.PostBy.Id" style="text-decoration:none; font-weight: bold">@item.PostBy.Username</a>
                        <span style="font-size: 13px; color: grey">- @item.PostBy.Ponit điểm</span> <span
                                                                                                        style="float: right; display: table-cell">+<span id="commentPoint @item.Id">@item.UpVotes
                                                                                                                                                   </span>
                                                                                                        <img src="/Content/Images/vote-yes.ico" width="18px" height="18px" /></span>
                        <div class="removeSpace">
                            @Html.Raw(item.ContentHtml)
                        </div>
                        <br />
                        <table width="100%">
                            <tr>
                                <td style="padding-left: 0px">
                                    <span style="font-size: 13px; color: grey">Đăng lúc @item.PostedDate.ToString("HH:mm")
                                        ngày @item.PostedDate.ToString("dd-MM-yyyy")
                                    </span>
                                </td>
                                <td style="text-align: right; padding: 0px">
                                    @if (Model.CurrentUserId != 0)
                                    {
                                        <table style="font-size: 12px; float: right; text-align: right; padding-right: 0px">
                                            <tr>
                                                @if (Model.CurrentUserId == item.PostBy.Id)
                                                {
                                                    <td style="text-align: right;">
                                                        <a href="/Guide/EditComment?Id=@item.Id" class="titleLink" style="cursor: pointer; color: #034af3">
                                                            Sửa bình luận</a>
                                                    </td>
                                                    <td style="text-align: right; padding-right: 0px">
                                                        <span class="titleLink" onclick="DeleteAnComment('@item.GuideId','@item.Id')" style="cursor: pointer; color: #034af3">
                                                            Xoá bình luận</span>
                                                    </td>
                                                }
                                                else
                                                {
                                                    if (item.IsVotedByCurrentUser)
                                                    {
                                                        <td style="text-align: right;">
                                                            <span class="titleLink" onclick="PlusPointForAnComment('@item.Id')" style="cursor: pointer; color: #034af3">
                                                                <span id="VoteCommentText @item.Id">Bỏ thích</span></span>
                                                        </td>
                                                                      
                                                    }
                                                    else
                                                    {
                                                        <td style="text-align: right;">
                                                            <span class="titleLink" onclick="PlusPointForAnComment('@item.Id')" style="cursor: pointer; color: #034af3">
                                                                <span id="VoteCommentText @item.Id">Thích</span></span>
                                                        </td>
                                                    }

                                                    if (item.IsReportedByCurrentUser)
                                                    {
                                                        <td style="text-align: right;">
                                                            <span class="titleLink" onclick="ReportAnComment('@item.Id')" style="cursor: pointer; color: #034af3">
                                                                <span id="ReportCommentText @item.Id">Huỷ báo cáo sai phạm</span></span>
                                                        </td>
                                                                      
                                                    }
                                                    else
                                                    {
                                                        <td style="text-align: right;">
                                                            <span class="titleLink" onclick="ReportAnComment('@item.Id')" style="cursor: pointer; color: #034af3">
                                                                <span id="ReportCommentText @item.Id">Báo cáo sai phạm</span></span>
                                                        </td>
                                                    }
                                                    if (User.IsInRole("Admin"))
                                                    {
                                                        <td style="text-align: right; padding-right: 0px">
                                                            <span class="titleLink" onclick="DeleteAnComment('@item.GuideId','@item.Id')" style="cursor: pointer; color: #034af3">
                                                                Xoá bình luận</span>
                                                        </td>
                                                    }
                                                }
                                            </tr>
                                        </table>
                                    }
                                </td>
                            </tr>
                        </table>
                    </td>
                </tr>
            </table>
            <br />
        }

    }
    <table width="100%">
        <tr>
            <td style="text-align: left; width: 20%">
                @if (Model.PageNo != 1)
                {
                    var targetDiv = "commentList";
                    var previousPage = @Model.PageNo - 1;
                    <input type="image" src="/Content/Images/hide-left.ico" id="btnGoFirst" onclick="GoToCommentPage('@Model.GuideId', '@Model.Condition', 1, '@targetDiv')" style="width: 20px; height: 20px;" title = "Xem Trang Đầu Tiên" />
                    <input type="image" src="/Content/Images/navigate-left.ico" id="btnGoPrevious" onclick="GoToCommentPage('@Model.GuideId', '@Model.Condition', '@previousPage', '@targetDiv')" style="width: 20px; height: 20px;" title = "Xem Trang Trước" />
                }
            </td>
            <td style="text-align: center; width: 60%">
                @if (Model.TotalPage == 0)
                {
                    <span align="left">Chưa Có Bình Luận Nào</span>
                }
                else
                {
                    if(Model.TotalPage > 1)
                    {
                        <span>Trang @Model.PageNo Trên Tổng Số @Model.TotalPage Trang</span>
                    }

                }
            </td>
            <td style="text-align: right; width: 20%">
                @if (Model.PageNo != Model.TotalPage && Model.TotalPage != 0)
                {
                    var targetDiv = "commentList";
                    var nextPage = @Model.PageNo + 1;
                    <input type="image" src="/Content/Images/navigate-right.ico" id="btnGoNext" onclick="GoToCommentPage('@Model.GuideId', '@Model.Condition', '@nextPage', '@targetDiv')" style="width: 20px; height: 20px" title="Xem Trang Sau" />
                    <input type="image" src="/Content/Images/hide-right.ico" id="btnGoNext" onclick="GoToCommentPage('@Model.GuideId', '@Model.Condition', '@Model.TotalPage', '@targetDiv')" style="width: 20px; height: 20px" title = "Xem Trang Cuối"/>
                }
            </td>
        </tr>
    </table>
</div>
